<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Document</title>
</head>
		<style type="text/css">
			.bog{
				margin: 0px;
				width: 110px;
				height: 80px;
				position: relative;
			
			}
		</style>
		<script type="text/javascript">
		var a = document.documentElement.clientWidth;
		window.onload = function(){			
			var d = document.getElementById('dog');			
			var time;		
			var b =window.getComputedStyle ? window.getComputedStyle(d,null).width : d.currentStyle.width;
			a = parseInt(a);
			b =	parseInt(b);
			b = a - b;
			var left = 0, c;					
			var run =function run(){
				if (left == 0) {
				d.setAttribute('src','./dog.gif');
					c = 0;
				}else if(left >= b){
				d.setAttribute('src','./bog.gif');
				c = 1;					
				}			
				if(c == 0){
					left +=10;					
				}else if(c == 1){
					left -=10;
				}else if(c == 2){
					left +=0;
				}
				d.style.left=left+'px';								
			}
				time = setInterval(run, 50);
				click = 0;
				var stop = document.getElementById('stop');
				stop.onclick = function  () {
					if(click==0){
						e = c;
						c = 2;
						click=1;
					}
					
				}

				var start = document.getElementById('start');
				start.onclick = function  () {
					c = e;
					click = 0;
					
				}		
		}
		//alert(a);


		</script>	

		
		






<body>
	<img class="bog" id="dog" src="./dog.gif" alt=""/><br/>
	<form action="">
		<input type="button" name="" value="停止" id="stop"/> 
		<input type="button" name="" value="继续" id="start" /> 
		
	</form>
</body>
</html>